<script setup lang="ts">
import { find } from 'lodash-es';
import type { ListType } from './type';

const props = defineProps({
  list: {
    type: Array<ListType>,
    default: () => [],
  },
  value: {
    type: String,
    default: '',
  },
  label: {
    type: String,
    default: '',
  },
});

const formatText = () => {
  if (props.label) {
    return props.label;
  } else {
    let obj = find(props.list, (item: ListType) => {
      return props.value === item.value;
    });
    return obj ? obj.label : '';
  }
};

const formatType = () => {
  if (props.label) {
    let obj = find(props.list, (item: ListType) => {
      return props.label === item.label;
    });
    return obj ? obj.type : '';
  } else {
    let obj = find(props.list, (item: ListType) => {
      return props.value === item.value;
    });
    return obj ? obj.type : '';
  }
};
</script>

<template>
  <n-tag :type="formatType()">{{ formatText() }}</n-tag>
</template>

<style scoped lang="less"></style>
